<template>
	<view>
		<view class="flex " :class="[type==1?'flex_wrap flex_sb':'']">
			<view class="fw-item" :style="{'marginRight':type==2?'20rpx':'0'}" v-for="(item,index) in list" :key="index" v-if="item.price && item.status==1">
				<view class="flex wid232">
					<image class="lef-icon" :src="item.icon" mode="aspectFill"></image>
					<view class="u-m-l-16">
						<view class="font_16_333 font_weight">
							{{item.name}}
						</view>
						<view class="font_10_666 u-m-t-10">
							{{item.desc}}
						</view>
					</view>
				</view>
				<view class="u-m-t-24">
					<span class="m-fh">￥</span>
					<span class="m-m">{{item.price}}</span>
					<span class="m-sj">/{{item.time_sku}}{{item.unit}}</span>
				</view>
				<view class="xd-btn"  @click="suborder(item)">
					立即咨询
				</view>
			</view>
		</view>
		
		<u-popup v-model="sofuwuShow" mode="bottom" closeable border-radius="32">
			<view class="po-bikan">
				<view class="bk-title u-m-b-32">
					服务项目名称
				</view>
				<view class="" v-if="sid">
					<subOrder @nexttick="nexttick" :priceList="priceList" :lid="sid"></subOrder>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import subOrder from '../../components/subOrder/subOrder.vue';
	export default {
		components: {
			subOrder,
			
		},
		name: "fuwuList",
		props: {
			type: {
				type: String,
				default: '1'
			},
			type2: {
				type: String,
				default: '1'
			},
			sid: {
				type: String | Number,
				default: ''
			},
		},
		created() {
			this.getlist()
		},
		data() {
			return {
				list:[],
				sofuwuShow: false,
				priceList:{}
			};
		},
		methods: {
			nexttick(){
				this.$api({
					url: '/user/release_online',
					method: 'post',
					data: {
						token: uni.getStorageSync("token"),
						lawyer_id:this.sid,
						// task_id:this.task_id,
						serve_id:this.priceList.id,
						// price_dur_min:this.price_dur_min,
						// price_dur_max:this.price_dur_max,
						// phone: this.phone,
						price:this.priceList.price,
						// province:this.province,
						// use_type:this.use_type,
						// content:this.content,
						// yhq_id:this.yhq_id,
						// gallery:this.gallery.toString()
					},
				}).then(res => {
					if (res.code == 1) {
						// uni.showToast({
						// 	title: "发布成功",
						// 	icon: "none"
						// });
						// setTimeout(()=>{
						// 	uni.navigateBack()
						// },1000)
						if(res.data.if_free==1){
							this.sofuwuShow = false
							uni.navigateTo({
								url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)+"&type=ljzx&lawyer_id="+this.sid
							})
							return
						}
						
						
						let that = this
						uni.requestPayment({
							provider: "wxpay",
							appid: res.data.pay_info.appId, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
							timeStamp: res.data.pay_info.timeStamp, // 时间戳（单位：秒）
							paySign: res.data.pay_info.paySign, //签名
							nonceStr: res.data.pay_info.nonceStr, // 随机字符串
							package: res.data.pay_info.prepay_id, // 固定值
							signType: res.data.pay_info.signType, // 签名算法，这里用的 MD5/RSA 签名
							success(res2) {
								if (res2.errMsg == "requestPayment:ok") {
									
									that.sofuwuShow = false
									// uni.showToast({
									// 	title: "购买成功",
									// 	icon: "none"
									// });
									uni.navigateTo({
										url: "/pages/index/paySuccess?list="+JSON.stringify(res.data)+"&type=ljzx&lawyer_id="+that.sid
									})
								}
							},
							fail(e) {
								console.log('支付失败支付失败支付失败', e)
								uni.showToast({
									title: "支付失败",
									icon: "none"
								});
							}
						})
					}
				})
			},
			suborder(e) {
				if(this.type2==2){
					this.$emit('suborder',e)
				}else{
					this.sofuwuShow = true
					this.priceList = e
				}
				// uni.navigateTo({
				// 	url: "/TXIM/pages/consultation/chat?id="+this.sid
				// })
				 
			},
			getlist(){
				this.$api({
					url: '/lawyer/serve_config',
					method: 'get',
					data: {
						token:uni.getStorageSync("token"),
						lawyer_id: this.sid,
					},
				}).then(res => {
					if (res.code == 1) {
						this.list = res.data
					}
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.po-bikan {
		padding: 40rpx 32rpx;
		background: #F6F6F6;
		width: 100%;
		padding-bottom: 0;
	
		.bk-title {
			font-weight: bold;
			font-size: 32rpx;
			color: #222222;
		}
	}
	.fw-item {
		padding: 26rpx 24rpx;
		width: 332rpx;
		// height: 260rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin-bottom: 20rpx;
		
		.wid232{
			width: 332rpx;
		}

		.lef-icon {
			width: 72rpx;
			height: 72rpx;
			// background-color: #eee;
		}

		.m-fh {
			font-weight: bold;
			font-size: 24rpx;
			color: #FC3A30;
		}

		.m-m {
			font-weight: bold;
			font-size: 36rpx;
			color: #FC3A30;
		}

		.m-sj {
			font-size: 24rpx;
			color: #666666;
		}

		.xd-btn {
			width: 156rpx;
			height: 56rpx;
			background: linear-gradient( 180deg, #FA2D2D 0%, #F40000 100%);
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			font-weight: bold;
			font-size: 24rpx;
			color: #FFFFFF;
			text-align: center;
			line-height: 56rpx;
			margin-top: 16rpx;
		}
	}
</style>